header{
	width:100%;
	height:60px;
	background-color: white;
	.logo{
		width:150px;
		height:35px;
		float: left;
		margin:{
			top:10px;
			left:20px;
		};
		img{
			width:150px;
			height:35px;
		}
	}
	nav{
		ul{
		width:50%;
		height:60px;
		margin:0 auto;
		display: flex;
			li{
				height:60px;
				padding:0 20px;
				text-align:center;
				line-height: 60px;
				font-size: 14px;
				a{
					float: left;
					width:100%;
					height:100%;
				}
				&:hover{
					border-bottom: 2px solid #FF0000;
				}
			}
			li:nth-child(1) img{
				width:25px;
				height:14px;
				position: relative;
				top:2px;
				left:7px;
			}
		}
	}
	
	.right{
		position: absolute;
		right:20px;
		top:20px;
		#out{
			display: none;
			position: relative;
			top:-6px;
		}
		a{
			margin:0 10px;
			img{
				width:25px;
				height:25px;
			}
			span{
				position: absolute;
				right:5px;
				top:-2px;
				width:16px;
				height:16px;
				font-size: 12px;
				text-align: center;
				line-height: 16px;
				border-radius: 50%;
				color:white;
				background-color: red;
			}
			&:hover{
				border-bottom: 2px solid #FF0000;
			}
		}
	}
	// #box1{
	// 	display: none;
	// 	width:350px;
	// 	height:280px;
	// 	background-color: white;
	// 	padding:40px 40px;
	// 	z-index: 444;
	// 	position: absolute;
	// 	right:0;
	// 	top:62px;
	// 	ul{
	// 		width:100%;
	// 		height:100%;
	// 		li{
	// 			width:100%;
	// 			height:50px;
	// 			font-size: 14px;
	// 			line-height:50px;
	// 			border-bottom: 1px solid #ccc;
	// 			a{
	// 				color:#666666;
	// 				&:hover{
	// 					color:black;
	// 				}
	// 			}
	// 		}
	// 		li:nth-child(4) a{
	// 			float: right;
	// 			color:#31B0D5;
	// 			&:hover{
	// 				text-decoration: underline;
	// 			}
	// 		}
	// 	}
	// }
	
}